<template>
	<view class="orderAddress">
		<image src="../../static/img/orderHome/order-address-icon.png" mode="widthFix"></image>
		<view class="right">
			<view class="address">
				<text>
					{{address}}
				</text>
				<text>{{code}}</text>
			</view>
			<image src="../../static/img/orderHome/copy-icon.png" mode="widthFix"></image>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		name: 'orderAddress',
		props: {
			address:{
				type:String,
				default:''
			},
			code:{
				type:String,
				default:''
			}
		}
	}
</script>

<style lang="scss" scoped>
	.orderAddress {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 40rpx;
		height: 153rpx;
		background-color: #fff;
		>image{
			width: 26rpx;
		}
		.right{
			width: 630rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			.address{
				display: flex;
				flex-direction: column;
				text{
					font-size: 28rpx;
					font-weight: 500;
					color: #111111;
					line-height: 30rpx;
				}
				text:first-child{
					width: 554rpx;
					overflow: hidden;
					-webkit-line-clamp: 3;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-box-orient: vertical;
				}
				text:last-child{
					width: 554rpx;
					overflow: hidden;
					-webkit-line-clamp: 1;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-box-orient: vertical;
				}
			}

			image{
				width: 28rpx;
			}
		}
	}
</style>
